<template>
  <el-menu
    :default-active="activeIndex"
    class="el-menu-demo"
    mode="horizontal"
    :ellipsis="false"
	:router="true"
    @select="handleSelect"
	background-color="#EFEEEF"
	text-color="#000000"
	active-text-color="#F007D9"
	style="position: fixed; top: 0;  left: 0;right: 0; z-index: 1000;"
  >
  <div>
    <el-menu-item index="/home/com/recom" style="border-bottom: none;background-color: transparent;">
      <img
        style="width: 50px"
        src="../assets/tubiao.png"
        alt="Element logo"
      />
	  <span>首页-购物商城</span>
    </el-menu-item>
	</div>
	
	<el-menu-item index="1" @click="go()" style="border-bottom: none; width: 312.5rem; background-color: transparent;">你好！{{store.state.user.uname}}</el-menu-item>
	<el-menu-item index="/enroll" style="border-bottom: none;background-color: transparent;">免费注册</el-menu-item>
	<el-menu-item index="/cus/myorders" style="border-bottom: none;background-color: transparent;">我的订单</el-menu-item>
	<el-menu-item index="" style="border-bottom: none;background-color: transparent;">
		<el-avatar>
		  <el-link @click="my()"><el-image :src="$ip+`/public/shows/`+store.state.user.pic" v-model="store.state.user.pic"  />
		</el-link>
		</el-avatar>
		
	</el-menu-item>
	<el-sub-menu index="2">
	      <template #title>更多</template>
	      <el-menu-item index="2-1">合作专区</el-menu-item>
	      <el-menu-item index="2-2">关于我们</el-menu-item>
	      <el-menu-item index="/text">退出</el-menu-item>
	    </el-sub-menu>
  </el-menu>
</template>

<script lang="ts" setup>
import {ref, reactive,onMounted,computed} from"vue"
	import {$get,$postx,$postj,$postf} from '../ajax/index.js'
	import { ElMessage, ElMessageBox } from 'element-plus'
	import router from"../router/index.js"
	import { User,Lock} from '@element-plus/icons-vue'
	import axios from'axios';
	import store from'../store/index.js'
	import {success,warning,message,errors} from '../store/alert.js'

const activeIndex = ref('1')
const handleSelect = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
function my(){
		console.log("我的")
		const c=store.state.user.perm[1].vip
		router.push("/"+c)
	}

function go(){
	const c=store.state.user.perm[1].vip
	router.push("/"+c)
}
</script>

<style scoped>
.el-menu--horizontal > .el-menu-item:nth-child(2) {
  margin-right: auto;
}
.el-menu--horizontal {
  --el-menu-horizontal-height: 50px;
}
.el-menu--horizontal > .el-menu-item--horizontal{
	border-bottom: #000000;
}
.el-menu--horizontal > .el-menu-item:hover {
  background-color: transparent;
  color: inherit;
}
</style>
